<div id="main_container">

	{$oZoneHeader}
    
    <div class="main_content">
        {$oZoneTopMenu}
        <div class="center_content">  
            <div class="left_content">
                {$oZoneLeftMenu}
                {if $iEssaiId && $iTypeId=='1'}
                    {$oZoneModeleLeft}
                {elseif $iEssaiId && $iTypeId=='2' }
                    {$oZoneGammeLeft}
                {/if}
                 {literal}
                <script>
                    $(function() {
                        
                        /* trie par ajax de la liste */
                        $( "#sortable" ).sortable({ opacity: 0.6, cursor: 'move', update: function() {
                                var order = $(this).sortable("serialize") ;
                                $.post("{/literal}{jurl 'essais~BoFiches:reOrder', array(), false}{literal}", order);
                            }
                        });
                        $( "#sortable" ).disableSelection();
                        
                        /* Chargement du selectbox par ajax */
                        $("#ess_iMarqueId").change(function(){
                            var zUrlModel = "{/literal}{jurl 'essais~BoFiches:ajaxGetModelByMarqueId', array(), false}{literal}" ;
                            $.post(zUrlModel,{iMarqueId: $(this).val()}, function(modele){
                              var options = '';
                              for (var i = 0; i < modele.length; i++) {
                                options += '<option value="' + modele[i].modele_id + '">' + modele[i].modele_libelle + '</option>';
                              }
                              $("#ess_iModelId").html(options);
                            });
                        });
                        
                        /* Validation */
                        $("#createForm").validate();

                    });
                </script>                    
                {/literal} 
             
            </div>
    
        <form id="createForm" class="Gmodeles" action="{jurl 'essais~BoFiches:save'}" method="POST">
            <div class="right_content">
                {if $oEssai->ess_id}
                <h2>{$oEssai->ess_zSousTitre}</h2>
                {else}
                <h2>{$zCenterTitle}</h2>
                {/if}
                  <input type="hidden" name="ess_id" value="{$oEssai->ess_id}" />
                  <input type="hidden" name="ess_dateCrea" value="{$oEssai->ess_dateCrea}" />
                  <input type="hidden" name="ess_iTypeId" value="{$iTypeId}" />
                  <input type="hidden" name="ess_iOrder" value="{$oEssai->ess_iOrder}" />
                  
                  <!--type = modele-->
                  <input type="hidden" value="{$typeDir}"  name="typeDir"/>
                  
                  {* $iTypeId => modele *}
                  {if $iTypeId == 1}
                  <dl>
                    <dt><label>Catégorie : </label></dt>
                    <dd>
                        <select id="ess_iCatId" name="ess_iCatId" >
                            {foreach $toCatVoitures as $oCatVoiture}
                            <option value="{$oCatVoiture->catV_id}" {if $oCatVoiture->catV_id == $oEssai->ess_iCatId}selected="selected"{/if}>{$oCatVoiture->catV_zLibelle|escxml}</option>
                            {/foreach}
                        </select>
                    </dd>
                  </dl>
                  {/if}
                  <dl>
                    <dt><label>Marque : </label></dt>
                    <dd>
                        <select id="ess_iMarqueId" name="ess_iMarqueId">
                            {foreach $toMarqueVoitures as $oMarqueVoiture}
                            <option value="{$oMarqueVoiture->marque_id}" {if $oMarqueVoiture->marque_id == $oEssai->ess_iMarqueId}selected="selected"{/if}>{$oMarqueVoiture->marque_libelle|escxml}</option>
                            {/foreach}
                        </select>
                    </dd>
                  </dl>
                  {* $iTypeId => modele *}
                  {if $iTypeId == 1}
                  <dl>
                    <dt><label>Modèle : </label></dt>
                    <dd>
                        <select id="ess_iModelId" name="ess_iModelId">
                            {foreach $toModelesVoitures as $oModelesVoiture}
                            <option value="{$oModelesVoiture->modele_id}" {if $oModelesVoiture->modele_id == $oEssai->ess_iModelId}selected="selected"{/if}>{$oModelesVoiture->modele_libelle|escxml}</option>
                            {/foreach}
                        </select>
                    </dd>
                  </dl>
                  <dl>
                    <dt><label>Version : </label></dt>
                    <dd><input type="text" value="{$oEssai->ess_zVersion}" name="ess_zVersion"/></dd>
                  </dl>
                  {/if}
                  <dl>
                    <dt><label>Sous-titre : </label></dt>
                    <dd><input type="text" value="{$oEssai->ess_zSousTitre}"  class="required"  name="ess_zSousTitre"/></dd>
                  </dl>
                  <dl style="height:auto">
                    <dt><label>Illustrations stockées  : </label></dt>
                    <dd><input type="text" id="ess_zImage"  name="ess_zImage" value="{$oEssai->ess_zImage}" readonly="readonly" style="width:300px;cursor:pointer" />
                        <input type="button" id="btnParcourir" value="Parcourir ..." />
                        <script type="text/javascript">
                            {literal}
                            function openKCFinder(field) {
                                window.KCFinder = {
                                    callBack: function(url) {
                                        window.KCFinder = null;
                                        // field.value = url;
                                        field.val(url) ;
                                    }
                                };
                                window.open(j_basepath+'kcfinder/browse.php?type=images&dir=images/', 'kcfinder_textbox',
                                    'status=0, toolbar=0, location=0, menubar=0, directories=0, ' +
                                    'resizable=1, scrollbars=0, width=800, height=600'
                                );
                            }
                            $(function(){
                                $('#btnParcourir').click(function(){
                                    var cible = $(this).prev('input');
                                    openKCFinder (cible) ;
                                });
                            });
                            {/literal}
                        </script><br />
                        <img src="{$oEssai->ess_zImage}" alt="" width="90" height="60" />
                    </dd>
                  </dl>
                  <dl style="height:auto">
                    <dt><label>Chapeau : </label></dt>
                    <dd style="width:600px;">
                        <textarea id="ess_zChapeau" name="ess_zChapeau" >{$oEssai->ess_zChapeau}</textarea>
                        <script type="text/javascript">
                            {literal}CKEDITOR.replace( 'ess_zChapeau', {width:'600px', toolbar:'AOToolbar'}) ;{/literal}
                        </script>
                    </dd>
                  </dl>
                 <dl>
                    <dt><label class="nPadd">Statut : </label></dt>
                    <dd>
                        <input type="radio" name="ess_statut" value="1" {if $oEssai->ess_statut == 1}checked="checked"{/if}/><span>activer</span><div class="legende" id="activer">&nbsp;</div>
                        <input type="radio" name="ess_statut" value="0" {if $oEssai->ess_statut == 0}checked="checked"{/if}/><span>désactiver</span><div class="legende" id="desactiver">&nbsp;</div>
                    </dd>
                 </dl>

                 <dl class="submit">
                   <input class="valider" title="Valider" type="submit" value="" style="margin-right:10px;" />
                   <a title="Annuler" href="{jurl 'essais~BoFiches:index', array('iTypeId'=>$iTypeId), false}" class="bt_green" >
                       <span class="bt_green_lft"></span>
                       <strong>Annuler</strong>
                       <span class="bt_green_r"></span>
                   </a>
                   {if $oEssai->ess_id}
                   <a title="Supprimer" href="{jurl 'essais~BoFiches:deleteEssai', array('iTypeId'=>$iTypeId , 'iId'=>$oEssai->ess_id), false}" class="bt_red" >
                       <span class="bt_red_lft"></span>
                       <strong>Supprimer</strong>
                       <span class="bt_red_r"></span>
                   </a>
                   {/if}
                 </dl>  

                </div><!-- end of right content-->
            </form>
        </div>   <!--end of center content -->               

        <div class="clear"></div>
    </div> <!--end of main content-->
	
    
    <div class="footer">
    </div>

</div>		
 {literal} 
         <style  type="text/css">

                

                /*Légende calidité code couleur libellé*/
                div.legende {width:30px; height:13px; display:inline-block; margin:0 15px 0 0;}
                div#activer{background-color:#99CCFF !important;}
                div#desactiver{background-color:#FFFF99 !important;}
                //div#supprimer { background-color:#CCCCCC !important; }

          </style>
{/literal}
